<template>
  <!--  <div class="index">-->
  <!--    <AppTopNav></AppTopNav>-->
  <!--    &lt;!&ndash; <topHeaderVue></topHeaderVue> &ndash;&gt;-->
  <!--    <div class="tags_header">-->
  <!--      <AppHeader></AppHeader>-->
  <!--    </div>-->
  <!--    <el-main>-->
  <!--      <router-view></router-view>-->
  <!--    </el-main>-->
  <!--  </div>-->
  <el-container>
    <el-header style="height: 100px">
      <AppTopNav></AppTopNav>
      <AppHeader></AppHeader>
    </el-header>
    <el-main>
      <router-view></router-view>
    </el-main>
  </el-container>
</template>
<script>
import AppTopNav from "@/components/top-nav.vue";
import AppHeader from "@/components/app-header.vue";
import { mapActions } from "vuex";

export default {
  components: {
    AppTopNav,
    AppHeader,
  },
  data() {
    return {
      websocket: null,
      timeoutObj: undefined,
      lockReconnect: false,
      flag: true,
      num: 0,
      server_data: "",
      clienHeight:
        document.documentElement.clientHeight || document.body.clientHeight,
      timer: null,
    };
  },
  methods: {
    ...mapActions({
      getUserInfo: "user/getUserInfo",
    }),
  },
  watch: {
    clienHeight(val) {
      //监控浏览器高度变化
      if (!this.timer) {
        this.clienHeight = val;
        this.$store.commit("user/listenHeight", val);
        this.timer = true;
        let that = this;
        setTimeout(function () {
          that.timer = false;
        }, 100);
      }
    },
  },
  mounted() {
    const that = this;
    window.onresize = () => {
      return (() => {
        (window.clienHeight =
          document.documentElement.clientHeight || document.body.clientHeight),
          (that.clienHeight = window.clienHeight);
      })();
    };
  },
};
</script>
<style lang="scss" scoped>
.el-container {
  background-color: #eef2f6;
}

.el-header {
  height: 115px;
  padding: 0;
}

.el-main {
  margin-top: 15px;
  padding: 15px 10px;
  height: calc(100vh - 115px);
  background-color: #fff;
}

.index {
  header {
    //background-color: #000;
    height: 100px;
  }

  .tags_header {
    height: 50px;
  }

  .el-main {
    position: relative;
    width: 100%;
    min-width: 1550px;
    padding: 0 10px !important;
    min-height: 800px;
    background-color: #fff;
  }

  .tags-header {
    //position: fixed;
    //left: 0;
    width: 100%;
    height: 50px;
    z-index: 998;
    background-color: #f0f2f5;
    top: 60px;
  }

  .el-tabs__header {
    margin: 0;
  }
}
</style>
